@import '@/common/style/flex.scss';
// @mixin item($padding: 10rpx, $margin: 0 20rpx) {
// 		padding: $padding;
// 		margin: $margin;
// 	}
// @mixin gloadColor($cl: black, $bottom: none) {
// 		color: $cl;
// 		border-bottom: $bottom;
// 	}

.index{
	@include flex-c;
	position: relative;
	z-index: 1;
	>.header{
		flex: 0 0 auto;
		position: relative;
		z-index: 2;
	}
	>.main{
		@include flex-c;
		flex: 1 0 0;
		position: relative;
		z-index: 1;
		background-color: #f7f7f7;
		.scroll{
			flex: 0 0 auto;
			background-color: #fff;
			.scrollX{
				width: 100%;
				height: 80rpx;
				white-space: nowrap;
				@include flex-r-evely-start;
				.scrollItem{
					position: relative;
					display: inline-block;
					padding: 0 10rpx;
					// margin: 0 30rpx;
					height: 100%;
					text-align: center;
					
					.scroll-item {
						color: black;
					}
					
					.scroll-item2 {
						color: #3582fb;
					}
				}
			}
			
		}
		.detailed{
			overflow: auto;
			flex: 1 0 0;
			position: relative;
			margin-top: 40rpx;
			background-color: #fff;
			&::-webkit-scrollbar{
				display: none;
			}
			.anition{
				position: absolute;
				right: 0;
				left: 0;
			}
		}
	}
}
.scrollItemBefore1::before{
	content: " ";
	display: block;
	height: 5rpx;
	background-color: #3582fb;
	position: absolute;
	bottom: 10rpx;
	left: 0;
	right: 0;
}
.scrollItemBefore2::before{
	content: " ";
	display: block;
	height: 5rpx;
	background-color: #fff;
	position: absolute;
	bottom: 10rpx;
	left: 0;
	right: 0;
}
